// JavaScript Document
// mian 图片 滚动插件
(function(){
	$.fn.extend({
		scrollLi: function(){
			el = this;

			// 图片下圆点
			var layout = $(el).find('.ind_layout');
			layout.find('span:first').addClass('on');
			var layout_w = layout.width();
			layout.css({'left':'50%','margin-left':-(layout_w/2)})

			// 滚动图片
			var ul = $(el).find('ul');
			var li = ul.find('li');
			var len = ul.find('li:last').index()+1;
			var liH = li.height();
			var liW = li.width();
			var ind = 0;
			var marR = parseInt(li.css('marginRight'))
			var scrollDis = liW+marR;
			// // 初始化数据 
			ul.width((liW+marR)*len);

			// 点击小按钮
			layout.find('span').hover(function(){
				clearInterval(interScrollLi);
				ind = $(this).index();
				$(this).addClass('on').siblings().removeClass('on');
				var marL = -scrollDis*ind;
				ul.stop().animate({'left': marL});
			},function(){
				interScrollLi = setInterval(scrollLiFun,4000);

			})

			// 滚动方法
			var interScrollLi = setInterval(scrollLiFun,4000)
			function scrollLiFun(){
				var marL = parseInt(ul.css('left'));
				if(marL <= -(liW+marR)*(len-1)){
					ind = 0;
					marL = 0;					
				}else{
					ind++;
					marL -= scrollDis
				}
				layout.find('span:eq('+ind+')').addClass('on').siblings().removeClass('on');
				ul.stop().animate({'left': marL});
			}

			li.hover(function(){
				clearInterval(interScrollLi);
				$(this).find('.imgHover').stop().animate({'opacity': 1},200);
			},function(){
				interScrollLi = setInterval(scrollLiFun,4000)
				$(this).find('.imgHover').stop().animate({'opacity': 0},200);
			})
			



		}
	})
})()